<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="./css/common.css">
    <link rel="stylesheet" href="./css/css.css">
    <link rel="stylesheet" href="https://at.alicdn.com/t/font_425473_yra0d4j33zkhuxr.css">
    <script src="./js/jquery.min.js"></script>
    <title>Document</title>
</head>

<body>
    <div class="back">
        <div class="music-box">
            <div class="music-main clearfix">
                <div class="music-left">
                    <div class="main-img">
                        <img src="" alt="">
                    </div>
                    <div class="control">
                        <span class="love"><i class="iconfont icon-love"></i></span>
                        <span class="pause"><i class="iconfont icon-play"></i></span>
                        <span class="next"><i class="iconfont icon-next"></i></span>
                    </div>
                </div>
                <div class="music-info">
                    <div class="type-title">
                        <div class="type">random type</div>
                        <div class="title">Welcome My Music Box</div>
                    </div>
                    <div class="view"></div>
                    <div class="progress">
                        <div class="bar">
                            <div class="total"></div>
                            <div class="now"></div>
                        </div>
                        <div class="music-time">0:00</div>
                    </div>
                    <div class="info">
                        <div class="music-title">此时此刻</div>
                        <div class="music-author">许巍</div>
                    </div>
                </div>
            </div>
            <div class="music-type clearfix">
                <div class="img" title="0" alt="漫步春天">
                    <img src="https://ws1.sinaimg.cn/large/006tKfTcgy1fk8sgwb4lvj30hs0bugny.jpg" alt="">
                    <p title="漫步春天">漫步春天</p>
                </div>
                <div class="img" title="1" alt="秋日私语">
                    <img src="https://ws1.sinaimg.cn/large/006tKfTcgy1fk8slh4txej30hs0bujsd.jpg" alt="">
                    <p title="秋日私语">秋日私语</p>
                </div>
                <div class="img" title="2" alt="温暖冬日">
                    <img src="https://ws1.sinaimg.cn/large/006tKfTcgy1fk8snpfrxhj30hs0arjuk.jpg" alt="">
                    <p title="温暖冬日">温暖冬日</p>
                </div>
                <div class="img" title="8" alt="开车">
                    <img src="https://ws2.sinaimg.cn/large/006tKfTcgy1fk8srjz0gbj30hs0bu40k.jpg" alt="">
                    <p title="开车">开车</p>
                </div>
                <div class="img" title="9" alt="影视">
                    <img src="https://ws1.sinaimg.cn/large/006tKfTcgy1fk8sx2gm61j30zk0k0wh6.jpg" alt="">
                    <p title="影视">影视</p>
                </div>
                <div class="img" title="11" alt="经典老歌">
                    <img src="https://ws4.sinaimg.cn/large/006tKfTcgy1fk8ta2jkwfj30ez0a8alm.jpg" alt="">
                    <p title="经典老歌">经典老歌</p>
                </div>
            </div>
        </div>
        <div class="bottom"></div>
    </div>
    <script src="./js/jses5.js"></script>
</body>

</html>